import { Button, Modal, Form, Input } from 'antd';
import React from 'react';

interface IProps {
    showModal: boolean;
    setShowModal:(bool:boolean)=>void;
    title:string;
    subTitle:string;
    submitAticleEdit:(res:{title:string;subTitle:string;})=>void;
}

const MyModal = (props:IProps) => {
    let editable = localStorage.getItem('editable')

    const [form] = Form.useForm();

    const handleOk = () => {
        form.validateFields().then(res=>{
            // form.resetFields()
           props.submitAticleEdit(res)
        }).catch((err)=>{
            console.log(err)
        })
        // props.setShowModal(false)
    };

    const handleCancel = () => {
        props.setShowModal(false)
        // setIsModalVisible(false);
    };

    return (
        <Modal title="填写文章标题" visible={props.showModal} onOk={handleOk} onCancel={handleCancel} okText="提交" cancelText="取消" okButtonProps={{ disabled: editable==='0' }} >
            <Form
                form={form}
                name="basic"
                initialValues={{title:props.title,subTitle:props.subTitle}}
                autoComplete="off"
            >
                <Form.Item
                    label="标题"
                    name="title"
                    rules={[{ required: true, message: '请输入标题' }]}
                >
                    <Input />
                </Form.Item>

                <Form.Item
                    label="副标题"
                    name="subTitle"
                >
                    <Input />
                </Form.Item>
                <p style={{color:'red',float:'right'}}>{editable==='0'?'暂无权限删除文章':''}</p>
            </Form>
        </Modal>
    );
};

export default MyModal;